.guideBox {
	position: relative;
	overflow: hidden;
}

.guideBG {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	overflow: hidden;
}

.guideBgBox {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	overflow: hidden;
	background-position: center center;
	background-size: cover;
}

.guidePosition {
	position: absolute;
	width: 1200px;
	height: 100%;
	left: 50%;
	margin-left: -600px;
	top: 0;
	z-index: 10;
}

.guidePositionC {
	position: relative;
}

.guidePoisitionT {
	padding: 0 215px;
}

.guidePoisitionT .title {
	height: 104px;
	line-height: 104px;
	font-size: 76px;
	color: #428a7b;
	font-weight: bold;
	transform: translateY(50px);
	-webkit-transform: translateY(50px);
	visibility: hidden;
	opacity: 0;
	-webkit-animation: titleAni 0.5s linear forwards;
	animation: titleAni 0.5s linear forwards;
}

.guidePoisitionT .text {
	line-height: 42px;
	font-size: 26px;
	color: #333;
	transform: translateY(50px);
	-webkit-transform: translateY(50px);
	visibility: hidden;
	opacity: 0;
	-webkit-animation: titleAnis 1s forwards;
	animation: titleAnis 1s forwards;
}

.guidePoisitionImg {
	position: relative;
	width: 1200px;
	height: 520px;
	/*transform: translateY(-50px);
	-webkit-transform: translateY(-50px);*/
	-webkit-animation: guideAnts 1s forwards;
	animation: guideAnts 1s forwards;
	visibility: visible;
	opacity: 0;
}

.guidePoisitionImgC {
	position: absolute;
	width: 85%;
	height: 100%;
	left: 50%;
	margin-left: -41%;
	top: 0;
	overflow: hidden;
}

.guidePoisitionImgC1 {
	background: url(../images/bg2.png) center center no-repeat;
}

.guidePoisitionImgC2 {
	background: url(../images/bg10.png) center center no-repeat;
}

.guidePoisitionImgC3 {
	background: url(../images/bg1.png) center center no-repeat;
}

.guidePoisitionImgC5 {
	background: url(../images/bg3.png) center center no-repeat;
}

.guidePoisitionImgC6 {
	background: url(../images/2011.png) center center no-repeat;
}

.guidePoisitionImgC7 {
	background: url(../images/2012.png) center center no-repeat;
}

.guidePoisitionImgC8 {
	background: url(../images/2017.png) center center no-repeat;
}

.guidePoisitionImgC9 {
	background: url(../images/bg4.png) center center no-repeat;
}

.guideImg {
	position: absolute;
	width: 150%;
	height: 150%;
	left: -25%;
	top: -25%;
}

.guideImg1 {
	-webkit-mask-image: url(../images/nature-sprite.png);
	mask-image: url(../images/nature-sprite.png);
	mask-origin: content-box;
	-webkit-mask-origin: content-box;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 2300% 100%;
	mask-size: 2300% 100%;
	-webkit-animation: mask-play 2s steps(22) forwards;
	animation: mask-play 2s steps(22) forwards;
}

.guideImg2 {
	-webkit-mask-image: url(../images/building-sprite-2.png);
	mask-image: url(../images/building-sprite-2.png);
	mask-origin: content-box;
	-webkit-mask-origin: content-box;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 8400% 100%;
	mask-size: 8400% 100%;
	-webkit-animation: mask-play2 2s steps(83) forwards;
	animation: mask-play2 2s steps(83) forwards;
}

.guideImg3 {
	-webkit-mask-image: url(../images/nature-sprite.png);
	mask-image: url(../images/nature-sprite.png);
	mask-origin: content-box;
	-webkit-mask-origin: content-box;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 2300% 100%;
	mask-size: 2300% 100%;
	-webkit-animation: mask-play 2s steps(22) forwards;
	animation: mask-play 2s steps(22) forwards;
}

.guideImg5 {
	-webkit-mask-image: url(../images/building-sprite-2.png);
	mask-image: url(../images/building-sprite-2.png);
	mask-origin: content-box;
	-webkit-mask-origin: content-box;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 8400% 100%;
	mask-size: 8400% 100%;
	-webkit-animation: mask-play2 2s steps(83) forwards;
	animation: mask-play2 2s steps(83) forwards;
}

.guideImg6 {
	-webkit-mask-image: url(../images/nature-sprite.png);
	mask-image: url(../images/nature-sprite.png);
	mask-origin: content-box;
	-webkit-mask-origin: content-box;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 2300% 100%;
	mask-size: 2300% 100%;
	-webkit-animation: mask-play 2s steps(22) forwards;
	animation: mask-play 2s steps(22) forwards;
}

.guideImg7 {
	-webkit-mask-image: url(../images/building-sprite-2.png);
	mask-image: url(../images/building-sprite-2.png);
	mask-origin: content-box;
	-webkit-mask-origin: content-box;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 8400% 100%;
	mask-size: 8400% 100%;
	-webkit-animation: mask-play2 2s steps(83) forwards;
	animation: mask-play2 2s steps(83) forwards;
}

.guideImg8 {
	-webkit-mask-image: url(../images/nature-sprite.png);
	mask-image: url(../images/nature-sprite.png);
	mask-origin: content-box;
	-webkit-mask-origin: content-box;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 2300% 100%;
	mask-size: 2300% 100%;
	-webkit-animation: mask-play 2s steps(22) forwards;
	animation: mask-play 2s steps(22) forwards;
}

.guideImg9 {
	-webkit-mask-image: url(../images/building-sprite-2.png);
	mask-image: url(../images/building-sprite-2.png);
	mask-origin: content-box;
	-webkit-mask-origin: content-box;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 8400% 100%;
	mask-size: 8400% 100%;
	-webkit-animation: mask-play2 2s steps(83) forwards;
	animation: mask-play2 2s steps(83) forwards;
}

.guidePosition3 {
	visibility: hidden;
	opacity: 0;
	animation: bganit3 12s forwards ease;
}

.guidePosition4 {
	visibility: hidden;
	opacity: 0;
	animation: bganit3 8s forwards ease;
}

.guidePosition5 {
	visibility: hidden;
	opacity: 0;
	animation: bganit3 8s forwards ease;
}

.guidePosition6 {
	visibility: hidden;
	opacity: 0;
	animation: bganit3 8s forwards ease;
}

.guidePosition7 {
	visibility: hidden;
	opacity: 0;
	animation: bganit3 8s forwards ease;
}

.guidePosition8 {
	visibility: hidden;
	opacity: 0;
	animation: bganit3 8s forwards ease;
}

.guidePosition9 {
	visibility: hidden;
	opacity: 0;
	animation: bganit3 8s forwards ease;
}

.guideBgBox2 {
	visibility: hidden;
	opacity: 0;
	animation: bganit1 3s forwards;
}

.guideBgBox3 {
	visibility: hidden;
	opacity: 0;
	animation: bganit1 3s forwards;
}

.guideBgBox5 {
	visibility: hidden;
	opacity: 0;
	animation: bganit1 3s forwards;
}

.guideBgBox6 {
	visibility: hidden;
	opacity: 0;
	animation: bganit1 3s forwards;
}

.guideBgBox7 {
	visibility: hidden;
	opacity: 0;
	animation: bganit1 3s forwards;
}

.guideBgBox8 {
	visibility: hidden;
	opacity: 0;
	animation: bganit1 3s forwards;
}

.guideBgBox9 {
	visibility: hidden;
	opacity: 0;
	animation: bganit1 3s forwards;
}

.guideBgBox4 {
	visibility: hidden;
	opacity: 0;
	animation: bganit4 1s forwards;
}

@keyframes bganit1 {
	from {
		visibility: hidden;
		opacity: 0;
	}
	to {
		visibility: visible;
		opacity: 1;
	}
}

.guidePosition2 {
	opacity: 1;
	visibility: visible;
	animation: bganit2 7s forwards;
}

@keyframes bganit2 {
	from {
		opacity: 1;
		visibility: visible;
	}

	to {
		visibility: hidden;
		opacity: 0;
	}
}

.guidePosition1 {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0%;
	top: 0;
	z-index: 5;
}

.guideLogo {
	height: 80px;
	line-height: 80px;
	text-align: center;
	animation: bganit5 2s forwards;
	transform: scale(0.0) translateY(150px);
	-webkit-transform: scale(0.0) translateY(150px);
}

.guideLogo img {
	display: block;
	margin: 0 auto;
}

.guideLogo1 {
	height: 46px;
	line-height: 46px;
	animation: bganit5 2s forwards linear;
	-webkit-animation: bganit5 2s forwards linear;
	transform: scale(0.0) translateY(150px);
	-webkit-transform: scale(0.0) translateY(150px)
}

.guideLogo1 img {
	display: block;
	height: 46px;
	margin: 0 auto;
}

.factoryCon {
	display: block;
	transform: scale(0);
	transform-origin: 50%;
	height: 300px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	animation: bganit6 2s forwards linear;
	-webkit-animation: bganit6 2s forwards linear;
}

/*动画每一个延迟的时间start*/

/*1985年延迟的时间start*/
.guidePosition3 {
	animation-delay: 4s;
}

.guidePosition3 .guidePoisitionT .title {
	animation-delay: 5s;
}

.guidePosition3 .guidePoisitionT .text {
	animation-delay: 6s;
}

.guidePosition3 .guidePoisitionImg {
	animation-delay: 6.5s;
}

.guideBgBox2 {
	animation-delay: 3.5s;
}

/*大背景*/

.guideImg2 {
	animation-delay: 7s;
}

/*1985年延迟的时间end*/

/*1998年延迟的时间start*/

.guidePosition4 {
	animation-delay: 14s;
}

.guidePosition4 .guidePoisitionT .title {
	animation-delay: 15s;
}

.guidePosition4 .guidePoisitionT .text {
	animation-delay: 16s;
}

.guidePosition4 .guidePoisitionImg {
	animation-delay: 16.5s;
}

.guideBgBox3 {
	animation-delay: 13s;
}

/*大背景*/

.guideImg3 {
	animation-delay: 17s;
}

/*1998年延迟的时间end*/

/*2011年延迟的时间start*/

.guidePosition5 {
	animation-delay: 20s;
}

.guidePosition5 .guidePoisitionT .title {
	animation-delay: 21s;
}

.guidePosition5 .guidePoisitionT .text {
	animation-delay: 22s;
}

.guidePosition5 .guidePoisitionImg {
	animation-delay: 22.5s;
}

.guideBgBox5 {
	animation-delay: 19s;
}

/*大背景*/

.guideImg5 {
	animation-delay: 23s;
}

/*2011年延迟的时间end*/

/*2012年延迟的时间start*/

.guidePosition6 {
	animation-delay: 26s;
}

.guidePosition6 .guidePoisitionT .title {
	animation-delay: 27s;
}

.guidePosition6 .guidePoisitionT .text {
	animation-delay: 28s;
}

.guidePosition6 .guidePoisitionImg {
	animation-delay: 28.5s;
}

.guideBgBox6 {
	animation-delay: 25s;
}

/*大背景*/

.guideImg6 {
	animation-delay: 29s;
}

/*2012年延迟的时间end*/

/*2015年延迟的时间start*/

.guidePosition7 {
	animation-delay: 32s;
}

.guidePosition7 .guidePoisitionT .title {
	animation-delay:33s;
}

.guidePosition7 .guidePoisitionT .text {
	animation-delay: 34s;
}

.guidePosition7 .guidePoisitionImg {
	animation-delay: 34.5s;
}

.guideBgBox7 {
	animation-delay: 31s;
}

/*大背景*/

.guideImg7 {
	animation-delay: 35s;
}

/*2015年延迟的时间end*/

/*2017年延迟的时间start*/

.guidePosition8 {
	animation-delay: 38s;
}

.guidePosition8 .guidePoisitionT .title {
	animation-delay: 39s;
}

.guidePosition8 .guidePoisitionT .text {
	animation-delay: 40s;
}

.guidePosition8 .guidePoisitionImg {
	animation-delay: 40.5s;
}

.guideBgBox8 {
	animation-delay: 37s;
}

/*大背景*/

.guideImg8 {
	animation-delay: 41s;
}

/*2017年延迟的时间end*/

/*2018年延迟的时间start*/

.guidePosition9 {
	animation-delay: 44s;
}

.guidePosition9 .guidePoisitionT .title {
	animation-delay: 45s;
}

.guidePosition9 .guidePoisitionT .text {
	animation-delay: 46s;
}

.guidePosition9 .guidePoisitionImg {
	animation-delay: 46.5s;
}

.guideBgBox9 {
	animation-delay: 43s;
}

/*大背景*/

.guideImg9 {
	animation-delay: 47s;
}

/*2018年延迟的时间end*/

/*第九个版面延迟的时间start*/

.guideBgBox4 {
	animation-delay: 49s;
}

/*大背景*/

.factoryCon {
	animation-delay: 51s;
}

.guideLogo {
	animation-delay: 52s;
}

.guideLogo1 {
	animation-delay: 53s;
}

/*第九个版面延迟的时间end*/

/*动画每一个延迟的时间end*/

/*开始加载动画 start*/

/*标题动画start*/

@keyframes titleAni {
	from {
		visibility: hidden;
		opacity: 0;
		transform: translateY(50px);
	}

	to {
		visibility: visible;
		opacity: 1;
		transform: translateY(0px);
	}
}

@keyframes titleAnis {
	from {
		visibility: hidden;
		opacity: 0;
		transform: translateY(30px);
	}

	to {
		visibility: visible;
		opacity: 1;
		transform: translateY(0px);
	}
}

@keyframes guideAnts {
	from {
		visibility: hidden;
		opacity: 0;
		/*transform: translateY(50px);*/
	}

	to {
		visibility: visible;
		opacity: 1;
		/*transform: translateY(0px);*/
	}
}

@keyframes bganit3 {
	0 {
		opacity: 0;
		visibility: hidden;
	}
	50% {
		visibility: visible;
		opacity: 1;
	}
	100% {
		visibility: hidden;
		opacity: 0;
	}
}

@keyframes bganit4 {
	form {
		opacity: 0;
		visibility: hidden;
	}
	to {
		visibility: visible;
		opacity: 1;
	}
}

@keyframes bganit6 {
	0 {
		transform: scale(0);
		visibility: hidden;
		opacity: 0;
	}
	50% {
		transform: scale(1.05);
		visibility: visible;
		opacity: 1;
	}
	100% {
		transform: scale(1);
		visibility: visible;
		opacity: 1;
	}
}

.shadeBg {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 5;
}

.shadeBg.show {
	animation: bganit7 0.3s infinite;
	background: url(../images/gBg.png) center center no-repeat;
	background-size: cover;
}

@keyframes bganit7 {
	form {
		visibility: visible;
		opacity: 1;
	}
	to {
		visibility: hidden;
		opacity: 0;
	}
}

@keyframes caoplay {
	0 {
		transform: rotate(0deg) translateX(0);
	}
	25% {
		transform: rotate(-0.2deg) translateX(-5px);
	}
	50% {
		transform: rotate(0deg) translateX(0px);
	}
	75% {
		transform: rotate(0.2deg) translateX(5px);
	}
	100% {
		transform: rotate(0deg) translateX(0px);
	}
}

@keyframes mask-play {
	from {
		-webkit-mask-position: 0% 0;
		mask-position: 0% 0;
	}

	to {
		-webkit-mask-position: 100% 0;
		mask-position: 100% 0;
	}
}

@keyframes mask-play2 {
	from {
		-webkit-mask-position: 0% 0;
		mask-position: 0% 0;
	}

	to {
		-webkit-mask-position: 100% 0;
		mask-position: 100% 0;
	}
}

@keyframes bganit5 {
	from {
		transform: scale(0) translateY(150px);
		-wenkit-transform: scale(0) translateY(150px);
	}

	to {
		transform: scale(1) translateY(0px);
		-wenkit-transform: scale(1) translateY(0px);
	}
}

.guideBoxBg1 {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	bottom: 0;
	background: url(../images/cao.png) bottom center no-repeat;
	animation: caoplay 4s ease-in infinite;
}
.guideBtn{
	position: fixed;
	width: 160px;
	height: 40px;
	line-height: 40px;
	bottom: 20px;
	left: 50%;
	margin-left: -40px;
	background: #b68d6b;
	border-radius: 20px;
	text-align: center;
	animation: caoplay1 1.5s ease-in infinite; 
	z-index: 20;
}
.guideBtn a{
	display: block;
	height: 40px;
	font-size: 14px;
	color: #fff;
}

@keyframes caoplay1{
	0 {
		bottom: 20px;
	}
	50% {
		bottom: 25px
	}
	100% {
		bottom: 20px
	}
}